<template>
  <div>
    <!--资质审批 -->
    <el-form
      :inline="true"
      label-position="right"
      size="small"
      class="filter-form-inline"
    >
      <el-row
        :gutter="40"
        style="margin-left: 0px;margin-right:0px;"
      >
        <el-col :span="8">
          <el-form-item
            label="流程编号："
            style="width: 100%;"
          >
            {{ detailData.processNo }}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item
            label="创建时间："
            style="width: 100%;"
          >
            {{ dateFormat('yyyy-mm-dd HH:MM',detailData.startTime) }}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item
            label="创建人："
            style="width: 100%;"
          >
            {{ detailData.initiator }}
          </el-form-item>
        </el-col>
        <el-col
          :lg="24"
          :xs="4"
          style="padding-left: 0;padding-right: 0"
        >
          <item-title title="终端资质信息" />
        </el-col>
        <el-col :span="8">
          <el-form-item
            label="终端名称："
            style="width: 100%;"
          >
            {{ detailData?.data?.terminalName }}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item
            label="终端类型："
            style="width: 100%;"
          >
            {{ getLabel('app_mode', detailData?.data?.terminalType) }}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="属性：">
            <span v-if="detailData?.data?.terminalType === 'first_terminal'">
              {{ getLabel('first_terminal', detailData?.data?.childProperty) }}</span>
            <span v-if="detailData?.data?.terminalType === 'second_terminal'">
              {{ getLabel('second_terminal', detailData?.data?.childProperty) }}</span>
            <span v-if="detailData?.data?.terminalType === 'third_terminal'">
              {{ getLabel('third_terminal', detailData?.data?.childProperty) }}</span>
          </el-form-item>
        </el-col>
        <el-col :lg="24">
          <div class="qualityFiles-container">
            <div
              v-for="(item,index) in detailData?.data?.qualifications"
              :key="index"
              class="file-item"
            >
              <image-upload-view
                ref="imageUploadView"
                disabled="true"
                :data="item"
              />
            </div>
          </div>
        </el-col>

      </el-row>
    </el-form>
  </div>
</template>

<script>
import {reactive, toRefs, watch} from 'vue'

export default {
  name: 'TerminalQuaCheck',
  props: {
    detailData: {
      type: Object,
      default() {
        return {
          data: {},
        }
      },
    },
  },
  setup(props) {
    var data = reactive({
      detailData: {},
    })
    watch(
      () => props.detailData,
      (newval, oldval) => {
        if (newval) {
          data.detailData = newval
          console.log(data.detailData, '-=-=--=-3332333=-=-==')
        }
      },
      { immediate: true, deep: true }
    )
    return {
      ...toRefs(data),
    }
  },
}
</script>

<style lang="scss" scoped>
</style>
